<!DOCTYPE html>
<html>
<head>
    <meta charset="utf-8"/>
    <title>IconFont</title>
    <link rel="stylesheet" href="demo.css">
    <link rel="stylesheet" href="iconfont.css">
</head>
<body>
<div class="main markdown">
    <h1>IconFont 图标</h1>
    <ul class="icon_lists clear">
        <li>
            <i class="icon iconfont icon-tupian"></i>

            <div class="name">图片</div>
            <div class="fontclass">.icon-tupian</div>
        </li>

        <li>
            <i class="icon iconfont icon-dayin"></i>

            <div class="name">打印</div>
            <div class="fontclass">.icon-dayin</div>
        </li>

        <li>
            <i class="icon iconfont icon-yiwen"></i>

            <div class="name">疑问</div>
            <div class="fontclass">.icon-yiwen</div>
        </li>

        <li>
            <i class="icon iconfont icon-iconfontcolor39"></i>

            <div class="name">电话</div>
            <div class="fontclass">.icon-iconfontcolor39</div>
        </li>

        <li>
            <i class="icon iconfont icon-yinliang"></i>

            <div class="name">音量</div>
            <div class="fontclass">.icon-yinliang</div>
        </li>

        <li>
            <i class="icon iconfont icon-xiayi1"></i>

            <div class="name">下移</div>
            <div class="fontclass">.icon-xiayi1</div>
        </li>

        <li>
            <i class="icon iconfont icon-qq"></i>

            <div class="name">qq</div>
            <div class="fontclass">.icon-qq</div>
        </li>

        <li>
            <i class="icon iconfont icon-fuzhi"></i>

            <div class="name">复制</div>
            <div class="fontclass">.icon-fuzhi</div>
        </li>

        <li>
            <i class="icon iconfont icon-weibo"></i>

            <div class="name">微博</div>
            <div class="fontclass">.icon-weibo</div>
        </li>

        <li>
            <i class="icon iconfont icon-jian"></i>

            <div class="name">减</div>
            <div class="fontclass">.icon-jian</div>
        </li>

        <li>
            <i class="icon iconfont icon-shipinbofangyingpian"></i>

            <div class="name">视频 播放 影片</div>
            <div class="fontclass">.icon-shipinbofangyingpian</div>
        </li>

        <li>
            <i class="icon iconfont icon-daochu"></i>

            <div class="name">导出</div>
            <div class="fontclass">.icon-daochu</div>
        </li>

        <li>
            <i class="icon iconfont icon-yaochi"></i>

            <div class="name">钥匙</div>
            <div class="fontclass">.icon-yaochi</div>
        </li>

        <li>
            <i class="icon iconfont icon-iconfontnan"></i>

            <div class="name">男</div>
            <div class="fontclass">.icon-iconfontnan</div>
        </li>

        <li>
            <i class="icon iconfont icon-webicon311"></i>

            <div class="name">放大</div>
            <div class="fontclass">.icon-webicon311</div>
        </li>

        <li>
            <i class="icon iconfont icon-jia"></i>

            <div class="name">加</div>
            <div class="fontclass">.icon-jia</div>
        </li>

        <li>
            <i class="icon iconfont icon-tupian1"></i>

            <div class="name">图片</div>
            <div class="fontclass">.icon-tupian1</div>
        </li>

        <li>
            <i class="icon iconfont icon-info"></i>

            <div class="name">提示</div>
            <div class="fontclass">.icon-info</div>
        </li>

        <li>
            <i class="icon iconfont icon-shuaxin"></i>

            <div class="name">刷新</div>
            <div class="fontclass">.icon-shuaxin</div>
        </li>

        <li>
            <i class="icon iconfont icon-nv"></i>

            <div class="name">女</div>
            <div class="fontclass">.icon-nv</div>
        </li>

        <li>
            <i class="icon iconfont icon-jingshi"></i>

            <div class="name">警示</div>
            <div class="fontclass">.icon-jingshi</div>
        </li>

        <li>
            <i class="icon iconfont icon-icon-"></i>

            <div class="name">微信</div>
            <div class="fontclass">.icon-icon-</div>
        </li>

        <li>
            <i class="icon iconfont icon-yidu"></i>

            <div class="name">已读</div>
            <div class="fontclass">.icon-yidu</div>
        </li>

        <li>
            <i class="icon iconfont icon-shezhi"></i>

            <div class="name">设置</div>
            <div class="fontclass">.icon-shezhi</div>
        </li>

        <li>
            <i class="icon iconfont icon-daoru"></i>

            <div class="name">导入</div>
            <div class="fontclass">.icon-daoru</div>
        </li>

        <li>
            <i class="icon iconfont icon-wenziICONCopy"></i>

            <div class="name">标题</div>
            <div class="fontclass">.icon-wenziICONCopy</div>
        </li>

        <li>
            <i class="icon iconfont icon-delete_fill"></i>

            <div class="name">delete_fill</div>
            <div class="fontclass">.icon-delete_fill</div>
        </li>

        <li>
            <i class="icon iconfont icon-document"></i>

            <div class="name">document</div>
            <div class="fontclass">.icon-document</div>
        </li>

        <li>
            <i class="icon iconfont icon-empty"></i>

            <div class="name">empty</div>
            <div class="fontclass">.icon-empty</div>
        </li>

        <li>
            <i class="icon iconfont icon-lock_fill"></i>

            <div class="name">lock_fill</div>
            <div class="fontclass">.icon-lock_fill</div>
        </li>

        <li>
            <i class="icon iconfont icon-manage_fill"></i>

            <div class="name">manage_fill</div>
            <div class="fontclass">.icon-manage_fill</div>
        </li>

        <li>
            <i class="icon iconfont icon-playon_fill"></i>

            <div class="name">playon_fill</div>
            <div class="fontclass">.icon-playon_fill</div>
        </li>

        <li>
            <i class="icon iconfont icon-playon"></i>

            <div class="name">playon</div>
            <div class="fontclass">.icon-playon</div>
        </li>

        <li>
            <i class="icon iconfont icon-shielding"></i>

            <div class="name">shielding</div>
            <div class="fontclass">.icon-shielding</div>
        </li>

        <li>
            <i class="icon iconfont icon-video"></i>

            <div class="name">video</div>
            <div class="fontclass">.icon-video</div>
        </li>

        <li>
            <i class="icon iconfont icon-import"></i>

            <div class="name">导入</div>
            <div class="fontclass">.icon-import</div>
        </li>

        <li>
            <i class="icon iconfont icon-shangchuan"></i>

            <div class="name">上传</div>
            <div class="fontclass">.icon-shangchuan</div>
        </li>

        <li>
            <i class="icon iconfont icon-yanjing"></i>

            <div class="name">眼睛</div>
            <div class="fontclass">.icon-yanjing</div>
        </li>

        <li>
            <i class="icon iconfont icon-yinpin"></i>

            <div class="name">音频</div>
            <div class="fontclass">.icon-yinpin</div>
        </li>

        <li>
            <i class="icon iconfont icon-yonghu"></i>

            <div class="name">用户</div>
            <div class="fontclass">.icon-yonghu</div>
        </li>

        <li>
            <i class="icon iconfont icon-icon-test"></i>

            <div class="name">H5</div>
            <div class="fontclass">.icon-icon-test</div>
        </li>

        <li>
            <i class="icon iconfont icon-dianshi"></i>

            <div class="name">电视</div>
            <div class="fontclass">.icon-dianshi</div>
        </li>

        <li>
            <i class="icon iconfont icon-quanpingsuoxiao"></i>

            <div class="name">全屏缩小</div>
            <div class="fontclass">.icon-quanpingsuoxiao</div>
        </li>

        <li>
            <i class="icon iconfont icon-youxiang"></i>

            <div class="name">邮箱</div>
            <div class="fontclass">.icon-youxiang</div>
        </li>

        <li>
            <i class="icon iconfont icon-yidong"></i>

            <div class="name">移动</div>
            <div class="fontclass">.icon-yidong</div>
        </li>

        <li>
            <i class="icon iconfont icon-luyin"></i>

            <div class="name">录音</div>
            <div class="fontclass">.icon-luyin</div>
        </li>

        <li>
            <i class="icon iconfont icon-add"></i>

            <div class="name">add</div>
            <div class="fontclass">.icon-add</div>
        </li>

        <li>
            <i class="icon iconfont icon-live"></i>

            <div class="name">live</div>
            <div class="fontclass">.icon-live</div>
        </li>

        <li>
            <i class="icon iconfont icon-drop-down"></i>

            <div class="name">drop-down</div>
            <div class="fontclass">.icon-drop-down</div>
        </li>

        <li>
            <i class="icon iconfont icon-pull"></i>

            <div class="name">pull</div>
            <div class="fontclass">.icon-pull</div>
        </li>

        <li>
            <i class="icon iconfont icon-liebiao"></i>

            <div class="name">列表</div>
            <div class="fontclass">.icon-liebiao</div>
        </li>

        <li>
            <i class="icon iconfont icon-yinpin-bofangzhong"></i>

            <div class="name">音频-播放中</div>
            <div class="fontclass">.icon-yinpin-bofangzhong</div>
        </li>

        <li>
            <i class="icon iconfont icon-jubao"></i>

            <div class="name">举报</div>
            <div class="fontclass">.icon-jubao</div>
        </li>

        <li>
            <i class="icon iconfont icon-xiazai"></i>

            <div class="name">下载</div>
            <div class="fontclass">.icon-xiazai</div>
        </li>

        <li>
            <i class="icon iconfont icon-kefu"></i>

            <div class="name">客服</div>
            <div class="fontclass">.icon-kefu</div>
        </li>

        <li>
            <i class="icon iconfont icon-chakan"></i>

            <div class="name">查看</div>
            <div class="fontclass">.icon-chakan</div>
        </li>

        <li>
            <i class="icon iconfont icon-shouting"></i>

            <div class="name">收听</div>
            <div class="fontclass">.icon-shouting</div>
        </li>

        <li>
            <i class="icon iconfont icon-sousuo"></i>

            <div class="name">搜索</div>
            <div class="fontclass">.icon-sousuo</div>
        </li>

        <li>
            <i class="icon iconfont icon-bofang"></i>

            <div class="name">播放</div>
            <div class="fontclass">.icon-bofang</div>
        </li>

        <li>
            <i class="icon iconfont icon-lianjie"></i>

            <div class="name">链接</div>
            <div class="fontclass">.icon-lianjie</div>
        </li>

        <li>
            <i class="icon iconfont icon-yinpin-weibofang"></i>

            <div class="name">音频-未播放</div>
            <div class="fontclass">.icon-yinpin-weibofang</div>
        </li>

        <li>
            <i class="icon iconfont icon-zhibo"></i>

            <div class="name">直播</div>
            <div class="fontclass">.icon-zhibo</div>
        </li>

        <li>
            <i class="icon iconfont icon-wo1"></i>

            <div class="name">我1</div>
            <div class="fontclass">.icon-wo1</div>
        </li>

        <li>
            <i class="icon iconfont icon-shijian"></i>

            <div class="name">时钟</div>
            <div class="fontclass">.icon-shijian</div>
        </li>

        <li>
            <i class="icon iconfont icon-zanting"></i>

            <div class="name">暂停</div>
            <div class="fontclass">.icon-zanting</div>
        </li>

        <li>
            <i class="icon iconfont icon-reping"></i>

            <div class="name">热评</div>
            <div class="fontclass">.icon-reping</div>
        </li>

        <li>
            <i class="icon iconfont icon-shenhe"></i>

            <div class="name">审核</div>
            <div class="fontclass">.icon-shenhe</div>
        </li>

        <li>
            <i class="icon iconfont icon-tongji"></i>

            <div class="name">统计</div>
            <div class="fontclass">.icon-tongji</div>
        </li>

        <li>
            <i class="icon iconfont icon-zhuanzai"></i>

            <div class="name">icon-reprint</div>
            <div class="fontclass">.icon-zhuanzai</div>
        </li>

        <li>
            <i class="icon iconfont icon-shangyi1"></i>

            <div class="name">上移</div>
            <div class="fontclass">.icon-shangyi1</div>
        </li>

        <li>
            <i class="icon iconfont icon-jifen"></i>

            <div class="name">积分</div>
            <div class="fontclass">.icon-jifen</div>
        </li>

        <li>
            <i class="icon iconfont icon-huodongbaoming"></i>

            <div class="name">活动报名</div>
            <div class="fontclass">.icon-huodongbaoming</div>
        </li>

        <li>
            <i class="icon iconfont icon-zhihangduilie-"></i>

            <div class="name">执行提交</div>
            <div class="fontclass">.icon-zhihangduilie-</div>
        </li>

        <li>
            <i class="icon iconfont icon-guanbi-"></i>

            <div class="name">关闭-01</div>
            <div class="fontclass">.icon-guanbi-</div>
        </li>

        <li>
            <i class="icon iconfont icon-bianji-"></i>

            <div class="name">编辑-01</div>
            <div class="fontclass">.icon-bianji-</div>
        </li>

        <li>
            <i class="icon iconfont icon-jiemudan-"></i>

            <div class="name">节目单-01</div>
            <div class="fontclass">.icon-jiemudan-</div>
        </li>

        <li>
            <i class="icon iconfont icon-chaitiao-"></i>

            <div class="name">拆条-01</div>
            <div class="fontclass">.icon-chaitiao-</div>
        </li>

        <li>
            <i class="icon iconfont icon-chenggong-"></i>

            <div class="name">成功-01</div>
            <div class="fontclass">.icon-chenggong-</div>
        </li>

        <li>
            <i class="icon iconfont icon-rili-"></i>

            <div class="name">日历-01</div>
            <div class="fontclass">.icon-rili-</div>
        </li>

        <li>
            <i class="icon iconfont icon-dadian-"></i>

            <div class="name">打点-01</div>
            <div class="fontclass">.icon-dadian-</div>
        </li>

        <li>
            <i class="icon iconfont icon-shanchu-"></i>

            <div class="name">删除-01</div>
            <div class="fontclass">.icon-shanchu-</div>
        </li>

        <li>
            <i class="icon iconfont icon-kuaibian-"></i>

            <div class="name">快编-01</div>
            <div class="fontclass">.icon-kuaibian-</div>
        </li>

        <li>
            <i class="icon iconfont icon-shoulu-"></i>

            <div class="name">收录-01</div>
            <div class="fontclass">.icon-shoulu-</div>
        </li>

        <li>
            <i class="icon iconfont icon-shouji-"></i>

            <div class="name">手机-01</div>
            <div class="fontclass">.icon-shouji-</div>
        </li>

        <li>
            <i class="icon iconfont icon-shiyi-"></i>

            <div class="name">时移-01</div>
            <div class="fontclass">.icon-shiyi-</div>
        </li>

        <li>
            <i class="icon iconfont icon-sousuo-"></i>

            <div class="name">搜索-01</div>
            <div class="fontclass">.icon-sousuo-</div>
        </li>

        <li>
            <i class="icon iconfont icon-shuaxin-"></i>

            <div class="name">刷新-01</div>
            <div class="fontclass">.icon-shuaxin-</div>
        </li>

        <li>
            <i class="icon iconfont icon-tianjia_-"></i>

            <div class="name">添加_1-01</div>
            <div class="fontclass">.icon-tianjia_-</div>
        </li>

        <li>
            <i class="icon iconfont icon-tianjiatupian-"></i>

            <div class="name">添加图片-01</div>
            <div class="fontclass">.icon-tianjiatupian-</div>
        </li>

        <li>
            <i class="icon iconfont icon-youjian-"></i>

            <div class="name">邮件-01</div>
            <div class="fontclass">.icon-youjian-</div>
        </li>

        <li>
            <i class="icon iconfont icon-zhuanma-"></i>

            <div class="name">转码-01</div>
            <div class="fontclass">.icon-zhuanma-</div>
        </li>

        <li>
            <i class="icon iconfont icon-tianjia-"></i>

            <div class="name">添加-01</div>
            <div class="fontclass">.icon-tianjia-</div>
        </li>

        <li>
            <i class="icon iconfont icon-xiala-"></i>

            <div class="name">下拉-01</div>
            <div class="fontclass">.icon-xiala-</div>
        </li>

        <li>
            <i class="icon iconfont icon-pc-"></i>

            <div class="name">pc-01</div>
            <div class="fontclass">.icon-pc-</div>
        </li>

        <li>
            <i class="icon iconfont icon-gouzi-"></i>

            <div class="name">钩子-01</div>
            <div class="fontclass">.icon-gouzi-</div>
        </li>

        <li>
            <i class="icon iconfont icon-shanchuqieduan"></i>

            <div class="name">删除切段</div>
            <div class="fontclass">.icon-shanchuqieduan</div>
        </li>

        <li>
            <i class="icon iconfont icon-chudian"></i>

            <div class="name">出点2</div>
            <div class="fontclass">.icon-chudian</div>
        </li>

        <li>
            <i class="icon iconfont icon-rudian"></i>

            <div class="name">入点2</div>
            <div class="fontclass">.icon-rudian</div>
        </li>

        <li>
            <i class="icon iconfont icon-chudian1"></i>

            <div class="name">出点</div>
            <div class="fontclass">.icon-chudian1</div>
        </li>

        <li>
            <i class="icon iconfont icon-rudian1"></i>

            <div class="name">入点</div>
            <div class="fontclass">.icon-rudian1</div>
        </li>

        <li>
            <i class="icon iconfont icon-tiaozhuanrudian"></i>

            <div class="name">跳转入点2</div>
            <div class="fontclass">.icon-tiaozhuanrudian</div>
        </li>

        <li>
            <i class="icon iconfont icon-shanchuqieduan1"></i>

            <div class="name">删除切段2</div>
            <div class="fontclass">.icon-shanchuqieduan1</div>
        </li>

        <li>
            <i class="icon iconfont icon-tiaozhuanchudian"></i>

            <div class="name">跳转出点2</div>
            <div class="fontclass">.icon-tiaozhuanchudian</div>
        </li>

        <li>
            <i class="icon iconfont icon-tianjiaqieduan"></i>

            <div class="name">添加切段2</div>
            <div class="fontclass">.icon-tianjiaqieduan</div>
        </li>

        <li>
            <i class="icon iconfont icon-tiaozhuanchudian1"></i>

            <div class="name">跳转出点</div>
            <div class="fontclass">.icon-tiaozhuanchudian1</div>
        </li>

        <li>
            <i class="icon iconfont icon-tianjiaqieduan1"></i>

            <div class="name">添加切段</div>
            <div class="fontclass">.icon-tianjiaqieduan1</div>
        </li>

        <li>
            <i class="icon iconfont icon-tiaozhuanrudian1"></i>

            <div class="name">跳转入点</div>
            <div class="fontclass">.icon-tiaozhuanrudian1</div>
        </li>

        <li>
            <i class="icon iconfont icon-dangqianzhen"></i>

            <div class="name">当前帧2</div>
            <div class="fontclass">.icon-dangqianzhen</div>
        </li>

        <li>
            <i class="icon iconfont icon-dangqianzhen1"></i>

            <div class="name">当前帧</div>
            <div class="fontclass">.icon-dangqianzhen1</div>
        </li>

        <li>
            <i class="icon iconfont icon-qianyigeqieduan"></i>

            <div class="name">前一个切段</div>
            <div class="fontclass">.icon-qianyigeqieduan</div>
        </li>

        <li>
            <i class="icon iconfont icon-houyigeqieduan"></i>

            <div class="name">后一个切段</div>
            <div class="fontclass">.icon-houyigeqieduan</div>
        </li>

        <li>
            <i class="icon iconfont icon-qianjinS"></i>

            <div class="name">前进10S</div>
            <div class="fontclass">.icon-qianjinS</div>
        </li>

        <li>
            <i class="icon iconfont icon-houtuiS"></i>

            <div class="name">后退10S</div>
            <div class="fontclass">.icon-houtuiS</div>
        </li>

        <li>
            <i class="icon iconfont icon-qianjin"></i>

            <div class="name">前进2</div>
            <div class="fontclass">.icon-qianjin</div>
        </li>

        <li>
            <i class="icon iconfont icon-houtui"></i>

            <div class="name">后退</div>
            <div class="fontclass">.icon-houtui</div>
        </li>

        <li>
            <i class="icon iconfont icon-qianyiduanshipin"></i>

            <div class="name">前一段视频</div>
            <div class="fontclass">.icon-qianyiduanshipin</div>
        </li>

        <li>
            <i class="icon iconfont icon-houyiduanshipin"></i>

            <div class="name">后一段视频</div>
            <div class="fontclass">.icon-houyiduanshipin</div>
        </li>

        <li>
            <i class="icon iconfont icon-jietu"></i>

            <div class="name">截图</div>
            <div class="fontclass">.icon-jietu</div>
        </li>

        <li>
            <i class="icon iconfont icon-jiankan"></i>

            <div class="name">监看</div>
            <div class="fontclass">.icon-jiankan</div>
        </li>

        <li>
            <i class="icon iconfont icon-quanping"></i>

            <div class="name">全屏</div>
            <div class="fontclass">.icon-quanping</div>
        </li>

        <li>
            <i class="icon iconfont icon-gonggao"></i>

            <div class="name">公告</div>
            <div class="fontclass">.icon-gonggao</div>
        </li>

        <li>
            <i class="icon iconfont icon-tiaozhuan"></i>

            <div class="name">跳转</div>
            <div class="fontclass">.icon-tiaozhuan</div>
        </li>

        <li>
            <i class="icon iconfont icon-gengduo"></i>

            <div class="name">更多</div>
            <div class="fontclass">.icon-gengduo</div>
        </li>

        <li>
            <i class="icon iconfont icon-wangyoutiwen"></i>

            <div class="name">网友提问</div>
            <div class="fontclass">.icon-wangyoutiwen</div>
        </li>

        <li>
            <i class="icon iconfont icon-paihang"></i>

            <div class="name">排行</div>
            <div class="fontclass">.icon-paihang</div>
        </li>

        <li>
            <i class="icon iconfont icon-bumen"></i>

            <div class="name">部门</div>
            <div class="fontclass">.icon-bumen</div>
        </li>

        <li>
            <i class="icon iconfont icon-xiangzuo"></i>

            <div class="name">向左</div>
            <div class="fontclass">.icon-xiangzuo</div>
        </li>

        <li>
            <i class="icon iconfont icon-zhibo1"></i>

            <div class="name">直播</div>
            <div class="fontclass">.icon-zhibo1</div>
        </li>

        <li>
            <i class="icon iconfont icon-qianjin1"></i>

            <div class="name">前进</div>
            <div class="fontclass">.icon-qianjin1</div>
        </li>

        <li>
            <i class="icon iconfont icon-houtui1"></i>

            <div class="name">后退</div>
            <div class="fontclass">.icon-houtui1</div>
        </li>

        <li>
            <i class="icon iconfont icon-shanchu"></i>

            <div class="name">删除</div>
            <div class="fontclass">.icon-shanchu</div>
        </li>

        <li>
            <i class="icon iconfont icon-renzheng-"></i>

            <div class="name">renzheng-01</div>
            <div class="fontclass">.icon-renzheng-</div>
        </li>

        <li>
            <i class="icon iconfont icon-tubiaozhizuomoban"></i>

            <div class="name">图标制作模版 (1)</div>
            <div class="fontclass">.icon-tubiaozhizuomoban</div>
        </li>

        <li>
            <i class="icon iconfont icon-lishijilu"></i>

            <div class="name">历史记录</div>
            <div class="fontclass">.icon-lishijilu</div>
        </li>

        <li>
            <i class="icon iconfont icon-shenhe1"></i>

            <div class="name">审核</div>
            <div class="fontclass">.icon-shenhe1</div>
        </li>

        <li>
            <i class="icon iconfont icon-toudi"></i>

            <div class="name">投递</div>
            <div class="fontclass">.icon-toudi</div>
        </li>

        <li>
            <i class="icon iconfont icon-zhiding"></i>

            <div class="name">置顶</div>
            <div class="fontclass">.icon-zhiding</div>
        </li>

        <li>
            <i class="icon iconfont icon-yingyongxinxi"></i>

            <div class="name">应用信息</div>
            <div class="fontclass">.icon-yingyongxinxi</div>
        </li>

        <li>
            <i class="icon iconfont icon-tubiaozhizuomoban-"></i>

            <div class="name">图标制作模版 (1)-01</div>
            <div class="fontclass">.icon-tubiaozhizuomoban-</div>
        </li>

        <li>
            <i class="icon iconfont icon-SUO-"></i>

            <div class="name">SUO-01</div>
            <div class="fontclass">.icon-SUO-</div>
        </li>

        <li>
            <i class="icon iconfont icon-zhiding1"></i>

            <div class="name">置顶</div>
            <div class="fontclass">.icon-zhiding1</div>
        </li>

        <li>
            <i class="icon iconfont icon-chegao"></i>

            <div class="name">撤稿</div>
            <div class="fontclass">.icon-chegao</div>
        </li>

        <li>
            <i class="icon iconfont icon-zhongxinfasong"></i>

            <div class="name">重新发送</div>
            <div class="fontclass">.icon-zhongxinfasong</div>
        </li>

        <li>
            <i class="icon iconfont icon-xiayi"></i>

            <div class="name">下移</div>
            <div class="fontclass">.icon-xiayi</div>
        </li>

        <li>
            <i class="icon iconfont icon-gouxuan"></i>

            <div class="name">勾选</div>
            <div class="fontclass">.icon-gouxuan</div>
        </li>

        <li>
            <i class="icon iconfont icon-shangyi"></i>

            <div class="name">上移</div>
            <div class="fontclass">.icon-shangyi</div>
        </li>

        <li>
            <i class="icon iconfont icon-chehui"></i>

            <div class="name">撤回</div>
            <div class="fontclass">.icon-chehui</div>
        </li>

        <li>
            <i class="icon iconfont icon-zhuye"></i>

            <div class="name">主面板</div>
            <div class="fontclass">.icon-zhuye</div>
        </li>

        <li>
            <i class="icon iconfont icon-toudi1"></i>

            <div class="name">投递2</div>
            <div class="fontclass">.icon-toudi1</div>
        </li>

        <li>
            <i class="icon iconfont icon-biaoqing"></i>

            <div class="name">表情</div>
            <div class="fontclass">.icon-biaoqing</div>
        </li>

        <li>
            <i class="icon iconfont icon-shanchubiaoqing"></i>

            <div class="name">删除表情</div>
            <div class="fontclass">.icon-shanchubiaoqing</div>
        </li>

        <li>
            <i class="icon iconfont icon-shexiangtou"></i>

            <div class="name">摄像头</div>
            <div class="fontclass">.icon-shexiangtou</div>
        </li>

        <li>
            <i class="icon iconfont icon-zitiku-dama"></i>

            <div class="name">字体库-打码</div>
            <div class="fontclass">.icon-zitiku-dama</div>
        </li>

        <li>
            <i class="icon iconfont icon-setting"></i>

            <div class="name">setting</div>
            <div class="fontclass">.icon-setting</div>
        </li>

        <li>
            <i class="icon iconfont icon-video_setting-"></i>

            <div class="name">video_setting-01</div>
            <div class="fontclass">.icon-video_setting-</div>
        </li>

        <li>
            <i class="icon iconfont icon-list"></i>

            <div class="name">list</div>
            <div class="fontclass">.icon-list</div>
        </li>

        <li>
            <i class="icon iconfont icon-check"></i>

            <div class="name">check</div>
            <div class="fontclass">.icon-check</div>
        </li>

        <li>
            <i class="icon iconfont icon-jian1"></i>

            <div class="name">jian</div>
            <div class="fontclass">.icon-jian1</div>
        </li>

        <li>
            <i class="icon iconfont icon-history"></i>

            <div class="name">history</div>
            <div class="fontclass">.icon-history</div>
        </li>

        <li>
            <i class="icon iconfont icon-duozuhuzhibo-"></i>

            <div class="name">多租户直播</div>
            <div class="fontclass">.icon-duozuhuzhibo-</div>
        </li>

    </ul>

    <h2 id="font-class-">font-class引用</h2>
    <hr>

    <p>font-class是unicode使用方式的一种变种，主要是解决unicode书写不直观，语意不明确的问题。</p>

    <p>与unicode使用方式相比，具有如下特点：</p>
    <ul>
        <li>兼容性良好，支持ie8+，及所有现代浏览器。</li>
        <li>相比于unicode语意明确，书写更直观。可以很容易分辨这个icon是什么。</li>
        <li>因为使用class来定义图标，所以当要替换图标时，只需要修改class里面的unicode引用。</li>
        <li>不过因为本质上还是使用的字体，所以多色图标还是不支持的。</li>
    </ul>
    <p>使用步骤如下：</p>

    <h3 id="-fontclass-">第一步：引入项目下面生成的fontclass代码：</h3>


    <pre><code class="lang-js hljs javascript"><span class="hljs-comment">&lt;link rel="stylesheet" type="text/css" href="./iconfont.css"&gt;</span></code></pre>
    <h3 id="-">第二步：挑选相应图标并获取类名，应用于页面：</h3>
    <pre><code class="lang-css hljs">&lt;<span class="hljs-selector-tag">i</span> <span
            class="hljs-selector-tag">class</span>="<span class="hljs-selector-tag">iconfont</span> <span
            class="hljs-selector-tag">icon-xxx</span>"&gt;&lt;/<span class="hljs-selector-tag">i</span>&gt;</code></pre>
    <blockquote>
        <p>"iconfont"是你项目下的font-family。可以通过编辑项目查看，默认是"iconfont"。</p>
    </blockquote>
</div>
</body>
</html>
